﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>jQuery ligerUI 中文官方网站</title>
    <link href="lib/LigerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    </style>
    <script src="lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>    
    <script src="lib/ligerUI/js/plugins/ligerDrag.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerLayout.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerTab.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerAccordion.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerTree.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerWindow.js" type="text/javascript"></script>
    
        <script type="text/javascript">
            var tab = null;
            var accordion = null;
            var tree = null;
            function f_heightChanged(options)
            { 
                if(tab)
                    tab.addHeight(options.diff);
                if (accordion)
                    accordion.setHeight(options.middleHeight - 24);
            }
            $(function ()
            {
                //布局
                $("#layout1").ligerLayout({ leftWidth: 190, height: '100%', onHeightChanged: f_heightChanged });

                var height = $(".l-layout-center").height();

                //Tab
                $("#framecenter").ligerTab({ height: height });

                //面板
                $("#accordion1").ligerAccordion({ height: height - 24, speed: null });



                //树
                $("#tree1").ligerTree({
                    checkbox: false,
                    nodeWidth: 100, 
                    attribute: ['nodename', 'url'],
                    onSelect: function (node)
                    {
                        if (!node.data.url) return;
                        var tabid = $(node.target).attr("tabid");
                        if (!tabid)
                        {
                            tabid = new Date().getTime();
                            $(node.target).attr("tabid", tabid)
                        }
                        f_addTab(tabid, node.data.text, node.data.url);
                    }
                });


                tab = $("#framecenter").ligerGetTabManager();
                accordion = $("#accordion1").ligerGetAccordionManager();
                tree = $("#tree1").ligerGetTreeManager(); 
                $("#pageloading").hide(); 
            });
            
            
            function f_addTab(tabid,text, url)
            { 
                tab.addTabItem({ tabid : tabid,text: text, url: url });
            } 

            function f_closeWindow(frame) {
                for (var i = 0; i < document.frames.length; i++) {
                    if (document.frames[i] == frame) {
                        $(".l-window[framename=" + document.frames[i].name + "]").remove();
                        return;
                    }
                }
            }
            function f_openWindow(url, title, width, height) {
                return $.ligerWindow.show({ width: width, height: height, left: 100, top: 100, title: title, url: url });
            }
            function f_open(url) {
                $.ligerWindow.show({ width: 300, height: 300, left: 100, top: 100, title: '我的标题', url: url });
            }
            function f_openWithContent(content) {
                var chtml = "<div style='padding:10px'>" + content + "</div>";
                $.ligerWindow.show({ width: 300, height: 300, left: 200, top: 200, title: '我的标题', content: chtml });
            }


     </script> 
<style type="text/css"> 
    body{ padding:0px; margin:0;   overflow:hidden;}  
    .l-link{ display:block; height:26px; line-height:26px; padding-left:10px; text-decoration:underline; color:#333;}
    .l-link2{text-decoration:underline; color:white;}
    .l-layout-top{background:#102A49; color:White;}
    .l-layout-bottom{ background:#E5EDEF; text-align:center;}
 </style>
</head>
<body> 
<div class="l-loading" style="display:block" id="pageloading"></div>
  <div id="layout1">
        <div position="top" style="background:#102A49; color:White;">
            <div style="margin-top:10px; margin-left:10px">jQuery ligerUI 中文官方网站</div>
        </div>
        <div position="left"  title="主要菜单" id="accordion1"> 
                     <div title="功能列表">
                         <ul id="tree1" style="margin-top:3px;">
                         <li isexpand="false">
                            <span>表格</span>
                            <ul> 
                                 <li url='demos/grid/fullgrid.htm'><span>百分比高度表格</span><li>
                                <li url='demos/grid/normalgrid.htm'><span>普通表格</span><li>
<!--                                <li url='demos/grid/detailgrid.htm'><span>明细表格</span><li>
                                <li url='demos/grid/detailgrid2.htm'><span>明细表格2</span><li>-->
                                <li url='demos/grid/dbeditgrid.htm'><span>编辑表格</span><li>
                               <!-- <li url='demos/grid/dbeditgrid2.htm'><span>编辑表格2</span><li>-->
  <!--                              <li url='demos/grid/grid.htm'><span>本地排序分页</span><li>
                                <li url='demos/grid/grid3.htm'><span>服务器数据，本地分页</span><li> -->
                                <li url='demos/grid/templategrid.htm'><span>模板列</span><li>
                                <li url='demos/grid/totalgrid.htm'><span>汇总表格</span><li>

                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>树</span>
                            <ul>
                                <li url='demos/tree/tree1.htm'><span>树(html初使化)</span><li>
                                <li url='demos/tree/tree2.htm'><span>树(data初使化)</span><li>
                                <li url='demos/tree/tree3.htm'><span>树(url初使化)</span><li>
                                <li url='demos/tree/tree4.htm'><span>可编辑</span><li>
                                <li url='demos/tree/tree5.htm'><span>接口方法</span><li>
                                <li url='demos/tree/tree6.htm'><span>丰富的事件支持</span><li>
                                <li url='demos/tree/tree7.htm'><span>模拟异步动态加载节点</span><li>
                            </ul>
                        </li> 
                        <li isexpand="false">
                            <span>下拉框</span>
                            <ul>
                                 <li url='demos/comboBox/comboBoxSelect.htm'><span>select表单</span><li>
                                <li url='demos/comboBox/comboBoxSingle.htm'><span>单选</span><li>
                                <li url='demos/comboBox/comboBoxSingleCheckBox.htm'><span>单选(复选框)</span><li>
                                <li url='demos/comboBox/comboBoxMul.htm'><span>多选</span><li>
                                <li url='demos/comboBox/comboBoxTable.htm'><span>表格</span><li>
                                <li url='demos/comboBox/comboBoxTableMul.htm'><span>表格(多选)</span><li>
                                <li url='demos/comboBox/comboBoxInterface.htm'><span>接口方法</span><li>
                                <li url='demos/comboBox/comboBoxEven.htm'><span>事件支持</span><li>
                                <li url='demos/comboBox/comboBoxCase001.htm'><span>联动效果</span><li>
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>drag</span>
                            <ul>
                                <li url='demos/base/drag.htm'><span>拖动</span><li>
                                <li url='demos/base/dragresizable.htm'><span>拖动并改变大小</span><li> 
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>resizable</span>
                            <ul> 
                                <li url='demos/base/resizable.htm' tabid='resizable'><span>改变大小</span></li> 
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>面板</span>
                            <ul>
                                 <li url='demos/layout/accordion.htm'><span>面板</span><li>
                                <li url='demos/layout/newlayout.htm'><span>布局</span><li>
                                <li url='demos/layout/layout2.htm'><span>组合布局</span><li>  
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>复选框</span>
                            <ul>
                                <li url='demos/form/checkbox.htm' tabid='checkbox'><span>复选框</span></li> 
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>日期时间</span>
                            <ul>
                                <li url='demos/form/dateEditor.htm' tabid='dateeditor'><span>日期时间</span></li> 
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>表单综合</span>
                            <ul>
                                <li url='demos/form/form.htm' tabid='form'><span>表单综合</span></li> 
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>布局</span>
                            <ul>
                                <li url='demos/layout/newlayout.htm' tabid='layout'><span>布局</span></li> 
                            </ul>
                        </li>
                         <li isexpand="false">
                            <span>弹出框</span>
                            <ul>
                                <li url='demos/base/messagebox.htm' tabid='messagebox'><span>弹出框</span></li> 
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>单选框</span>
                            <ul>
                                <li url='demos/form/radio.htm' tabid='radio'><span>单选框</span></li> 
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>调整器</span>
                            <ul>
                                <li url='demos/form/spinner.htm' tabid='spinner'><span>调整器</span></li> 
                            </ul>
                        </li>
                        <li isexpand="false">
                            <span>tab</span>
                            <ul>
                                <li url='demos/layout/navtab.htm' tabid='tab'><span>tab</span></li>  
                            </ul>
                        </li>
                         </ul>
                    </div>
                     <div title="窗口">
                        <ul>
                        <li><a href="javascript:f_open('welcome.htm')">窗口一</a></li>
                        <li><a href="javascript:f_openWithContent('这是内容')">窗口二</a></li>
                        <li><a href="javascript:f_open('demos/layout/layout2.htm')">窗口三</a></li>
                        </ul>

                    </div>  
                    <div title="其他">
                            其他内容
                    </div> 
        </div>
        <div position="center" id="framecenter"> 
            <div tabid="home" title="我的主页" style="height:300px" >
                <iframe frameborder="0" name="home" src="welcome.htm"></iframe>
            </div> 
        </div> 
        <div position="bottom">
            Copyright © 2011 www.ligerui.com
        </div>
    </div> 
        <div style="display:none">
    <!-- 流量统计代码 --> 
    </div>
</body>
</html>
